<template>
    <div class = "coupon_box" >
        <van-dialog class = "coupon_item" v-model="coupon_show" title="毕业旅行" :show-cancel-button = "false" confirmButtonText = "领取" :closeOnClickOverlay = "true" @confirm = "to_login" >
            <img src="../assets/coupon.png" style = "width: 100%;" />
            <span class = "close_btn" @click = "close_coupon"><van-icon name="cross" /></span>
        </van-dialog>
    </div>
</template>
<script>
import { Toast } from 'vant';
export default {
    name: 'coupon',
    data() {
        return {
            coupon_show: true
        }
    },
    methods: {
        to_login() {
            if(sessionStorage.getItem('cookie-session')){
                sessionStorage.setItem("wmxz",true)
                Toast.success('领取成功');
            }else{
                this.$router.push('/login');
            }
        },
        close_coupon() {
            this.coupon_show = false;
        }
    }
}
</script>

<style>
   
    .coupon_item .van-dialog__header {
        padding-top: 12px;
        padding-bottom: 5px;
        font-size: 24px;
        color: #696969;
    }
    .close_btn {
        display: inline-block;
        position: absolute;
        right: 10px;
        top: 0;
        text-align: center;
        width: 40px;
        height: 40px;
        font-size: 35px;
        color: #ccc;
        border-radius: 50%;
        border: none;
    }
    .van-icon{
        font-size: 22px!important;
    }
</style>    
